
<template>
	<view class="team-list-wrapper">
		
		<view class="team-item" v-for="(team, index) in teamList" :key="index" @click="goToDetail(team.id)">
			<view class="left-icon">
				<image :src="team.thumb"></image>
			</view>
			<view class="center-wrapper">
				<p>{{team.title}}</p>
				<p class="sub-p">{{team.keshis}}</p>
				<!-- <p class="desc-p">{{doctor.authority}}</p> -->
				<p></p>
				<view class="toolbar">
					
				</view>
			</view>
			<view class="right-label" @click="">
				<span>签约</span>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				teamList: []
			}
		},
		onLoad(option) {
			this.loadTeamList()
		},
		methods: {
			loadTeamList() {
				this.$app._get('team.lists', {}, (result) => {
					this.teamList = result
					console.log(result)
				})
			},
			goToDetail(id) {
				uni.navigateTo({
					url: '/pages/familyDoctor/signed?id=' + id
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.team-list-wrapper{
		width: 100%;
		height: 100%;
		background-color: #fff;
		box-sizing: border-box;
		.team-item {
			position: relative;
			display: flex;
			flex-direction: row;
			border-bottom: 1px solid #EEEEEE;
			background-color: #fff;
			padding: 12px 15px;
		
			.left-icon {
				width: 50px;
				height: 50px;
				border-radius: 50px;
				background-color: #41C177;
				display: flex;
				flex-direction: row;
				align-items: center;
				text-align: center;
				justify-content: center;
		
				image {
					width: 100%;
					height: 100%;
					border-radius: 50px;
				}
			}
		
			.center-wrapper {
				display: flex;
				flex: 1;
				flex-direction: column;
				padding-left: 10px;
				font-size: 1rem;
		
				.sub-p {
					font-size: 0.8rem;
					color: #757575;
				}
		
				.desc-p {
					font-size: 0.7rem;
					color: #757575;
				}
			}
		
			.right-label {
				display: flex;
				flex-direction: row;
				justify-content: flex-end;
				align-items: center;
		
				span {
					font-size: 0.6rem;
					background-color: #41C177;
					color: #fff;
					padding: 5px 7px 5px 7px;
					border-radius: 10px;
				}
			}
		}
	}
</style>